<!-- 越减越便宜升级版 -->
<template>
	<gzPageWrapper ref="gzPageWrapperRef" :styles="{ background: '#fff' }" :up="{ use: false, auto: false, isLock: true, empty: { use: false } }" :down="{ use: false, auto: false }" :nav="{ use: false }" :scroll="{ top: 0, fixed: true }" @upCallback="upCallback">
		<view class="container" :style="activityJson?.wrapper?.style">
			<!-- 活动攻略 -->
			<view class="tag" @click="onJumpActivityGuide(`/pagesActivity/ACTE017/guide?content=${encodeURIComponent(vdata.activityDetail.remark)}`)">活动攻略</view>
			<view class="content" :style="activityJson?.content?.style">
				<view class="title" :style="activityJson?.content?.title?.style">{{ activityJson?.content?.title?.title }}</view>
				<view class="list">
					<view class="item" :style="activityJson?.content?.block.style">
						<view class="inner" style="display: block;">
							<text v-if="isShowTakePartInBtn" style="font-weight: bold;">{{ couponNumber.balance > 0 ? '当前卡券剩余量~' : '今日奖品已被抢光，请下次再来~' }}</text>
							<text v-else-if="isJoinedToday" style="font-weight: bold;">恭喜您，{{ vdata.activityList.A.awardAliasName || '--' }}已到账，可立即享用!继续下列活动，有更多邮惠在等你~</text>
							<text v-else style="font-weight: bold;">还未到活动开始时间~</text>
							<!-- 只有当天参与过活动才不展示进度条 -->
							<template v-if="!isJoinedToday">
								<!-- 占位标签 -->
								<view style="height: 30rpx;"></view>
								<ProcessBar :percent="percent"/>
							</template>
						</view>
						<!-- 未参与活动 且 余量大于0 的时候 展示参与按钮 -->
						<button v-if="isShowTakePartInBtn && couponNumber.balance > 0" class="btn take-btn" :style="activityJson?.content?.btn1?.style" plain @click="upCallback">立即参与</button>
						<button v-else :style="{ ...activityJson?.content?.btn1?.style, background: '#C5C5C5' }" class="btn take-btn" plain @click="noCanJoinActivity">{{ isJoinedToday ? '您已参与' : '敬请期待' }}</button>
					</view>
					<template v-for="(value,key) in vdata.activityList">
						<view v-if="value.isShow" class="item" :style="activityJson?.content?.block.style">
							<view class="inner" @click="toUrl(value.path,key)">
								<image :src="value.icon"></image>
								<view>
									<view>{{ value.activityName }}</view>
									<view>{{ value.desc + (value.awardAliasName || '--') }}</view>
								</view>
								<button v-if="value.path" :style="activityJson?.content?.btn2?.style" plain>{{ value.btn }}</button>
								<button v-else plain :style="{ ...activityJson?.content?.btn2?.style, background: '#C5C5C5', color: '#fff' }">{{ value.btn }}</button>
							</view>
						</view>
					</template>
				</view>
			</view>
		</view>
	</gzPageWrapper>

	<!-- 活动攻略弹窗 -->
	<uni-popup ref="popupRef" type="center" :safe-area="false">
		<view class="popup-container">
			<view class="title">活动攻略</view>
			<view>
				<text>{{ vdata.activityDetail.remark?.replace(/\\n/g, "\n") }}</text>
			</view>
		</view>
	</uni-popup>
	
	<!-- 授权登录弹窗 -->
	<gzLoginPopup ref="gzLoginPopupRef" v-model:isLogin="vdata.isLogin" @isLoginCallback="isLoginCallback"></gzLoginPopup>
	<!-- 公共提示弹窗 -->
	<gzPopup ref="gzPopupRef" :titleBg="{ src: 'https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/e16f61e0-8734-424f-b037-710fcbd2c6e4.png', h: '280rpx' }" :btnBg="{ src: 'https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/fa5a52b3-75e3-4b67-8898-0859ac20ecce.png' }">{{ vdata.errorReason }}</gzPopup>
	<!-- 发券loadingloaing -->
	<uni-popup ref="loadingPopupRef" :mask-click="false">
		<view class="loading-popup-container">
			<view class="loading">
				<text style="animation-delay: 0s;">抢</text>
				<text style="animation-delay: 0.1s;">券</text>
				<text style="animation-delay: 0.2s;">中</text>
				<text style="animation-delay: 0.3s;">.</text>
				<text style="animation-delay: 0.4s;">.</text>
				<text style="animation-delay: 0.5s;">.</text>
			</view>
			<image class="popup-close" @click="loadingPopupClose" src="https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/fe990e6d-b03c-41f8-95b6-360822d39dbf.png" mode=""></image>
		</view>
	</uni-popup>
</template>

<script setup>
	import ProcessBar from "@/pagesActivity/ACTE024/components/ProcessBar.vue"
	import numberUtil from "@/util/numberUtil"
	import { ref, reactive, getCurrentInstance, computed } from 'vue'
	import { onLoad, onShow } from '@dcloudio/uni-app'
	import { $activityTakePartIn, $getActivityAwards, $sendAwardToUser, $fansDetail, $getCouponNumber } from '@/http/apiManager.js'
	import storageManage from '@/util/storageManage.js'
	import appConfig from '@/config/appConfig.js'
	import Polling from '@/util/polling'
	import dayjs from 'dayjs'
	import isSameOrBefore from '@/node_modules/dayjs/plugin/isSameOrBefore'
	import isSameOrAfter from '@/node_modules/dayjs/plugin/isSameOrAfter'
	dayjs.extend(isSameOrBefore)
	dayjs.extend(isSameOrAfter)
	
	const { $infoBox } = getCurrentInstance().appContext.config.globalProperties

	const gzLoginPopupRef = ref()
	// 页面容器 实例
	const gzPageWrapperRef = ref()
	// 活动攻略弹窗 实例
	const popupRef = ref()
	// 公共弹窗 实例
	const gzPopupRef = ref()
	// loading实例
	const loadingPopupRef = ref()

	// 数据源
	const vdata = reactive({
		isLogin: false,	// 用户是否登录
		fansInfo: {},	// 用户详情
		activityId: '', // 活动id
		activityDetail: {}, // 活动详情
		date: '',	// 公众号模板消息发送时间
		periodType: '',	// 当前活动周期性限制类型
		activityChannelId: null,	// 渠道ID
		errorReason: '',	// 参与活动错误原因
		isPeriodLimit: false,	// 周期性限制 false在当前周期 允许参与活动 true为历史周期 不允许参与活动
		activityList: { // 活动列表
			A: {
				icon: 'https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/7df069cb-f785-4015-867c-7d1067015c17.png',
				activityName: '福利一', // 活动名称
				desc: '参与活动获',
				btn: '未领取',
				path: '',
				isShow: true,
			},
			B1: { // 拉新
				icon: 'https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/c5d1a7a5-78b7-419b-ac9e-7a847531ec8b.png',
				activityName: '福利二', // 活动名称
				desc: '拉新有礼获',
				btn: '去拉新',
				path: '', // 跳转路径
				isShow: true,
			},
			B2: { // 实名
				icon: 'https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/e36a636e-592d-4104-b09f-32918475deab.png',
				activityName: '福利三',
				desc: '实名认证获',
				btn: '去实名',
				path: '',
				isShow: true,
			},
			B3: { // 实名
				icon: 'https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/900f25ee-96be-4024-80d1-695c92ceafa5.png',
				activityName: '福利四',
				desc: '新客邮礼获',
				btn: '去激活',
				path: '',
				isShow: true,
			},
			C: { // 激活
				icon: 'https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/73fd0a3c-4ea0-4c66-916c-04740890ed7a.png',
				activityName: '福利五',
				desc: '升金邮喜获',
				btn: '去激活',
				path: '',
				isShow: true,
			},
			D: { // 预约
				icon: 'https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/f7a76895-ff82-4f46-b237-f18abf663059.png',
				activityName: '福利六',
				desc: '预约有礼获',
				btn: '去预约',
				path: '',
				isShow: true,
			}
		}
	})
	
	function noCanJoinActivity(){
		if(!isShowTakePartInBtn.value){
			if(isJoinedToday.value){
				$infoBox.toast("您本周内已参与过当前活动~")
				return
			}
			$infoBox.toast("未到活动参与时间~")
			return
		}
		if(couponNumber.value.balance <= 0){
			$infoBox.toast('今日奖品已被抢光，请下次再来~')
			return
		}
	}
	
	let isJoinedToday = ref(false);	// 当天是否参与活动
	// 展示卡券状态还是立即领取
	const isShowTakePartInBtn = computed(() => {
		// 卡券领取时间非当天且在参与时间才展示立即参与按钮（目前只针对周限制进行开发，其他限制后续补充完善）
		const { specialType, specialContent, timeType, timeStart, timeEnd } = vdata.activityDetail
		const { createdAt } = vdata.activityList.A
		// 查询今天周几 是否在specialContent中 ;并且当前时间在限制时间内timeStart, timeEnd
		if(specialType === 1){	// 校验周 0~6 0为周日
			if(!specialContent.includes(dayjs().day())){	// 当天不可参与
				return false
			}
		}
		if(specialType === 2){	// 特殊日期可参与
			if(!specialContent.includes(dayjs().format('YYYY-MM-DD'))){	// 当天不可参与
				return false
			}
		}
		if(timeType === 1){	// 每个可以参与的天的可参与时间段限制
			if(!dayjs().isSameOrAfter(dayjs().format('YYYY-MM-DD ') + timeStart)){	// 未到开始时间
				return false
			}
			if(!dayjs().isSameOrBefore(dayjs().format('YYYY-MM-DD ') + timeEnd)){	// 已过结束时间
				return false
			}
		}
		/* if(createdAt){	// 存在历史卡券
			if(dayjs().isSame(dayjs(vdata.activityList.A.createdAt),'days')){	// 历史卡券领取为当天 今天参与过活动 不再允许参与活动
				isJoinedToday.value = true
				return false
			}
		} */
		if(createdAt){	// 存在历史卡券 (同一周只可参与一次)
			if(dayjs().subtract(1,'day').isSame(dayjs(vdata.activityList.A.createdAt),'week')){	// 同一周参与过 就不可再参与
				isJoinedToday.value = true
				return false
			}
		}
		return true
	})
	
	// 活动动态参数
	const activityJson = ref({
		"wrapper":{
			"style": {
				"background":"url('https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/a4f35f1a-9e99-4efd-84d3-bddeda7f4e6f.png') no-repeat center 30rpx / 303rpx 40rpx, url('https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/91b50d14-9772-4864-a106-e6a47f2c7d7d.png') no-repeat left top / 100% 852rpx, url('https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/c19bed66-a2c8-4d4d-88b7-8f52b866c9f6.png') no-repeat left top / 100% 100%"
			}
		},
		"content":{
			"title":{
				"text":"",
				"style":{
					"width":"100%",
					"height":"102rpx",
					"background":"background: url(https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/6fafe83d-307a-47df-bffa-b6921d7be668.png) no-repeat left top / 100% 100%"
				}
			},
			"block":{
				"style":{
					"background":"#FF4B46"
				}
			},
			"btn1":{
				"style":{
					"background":"linear-gradient(to right, #FE6038, #FF4C46)"
				}
			},
			"btn2":{
				"style":{
					"background":"#FDE9E9",
					"color":"#FF4B46"
				}
			},
			"style":{
				"background":"#fff",
				"margin-top":"654rpx"
			}
		}
	})
	const inviteJson = ref()	// 邀请页页面动态参数
	const invitedJson = ref()	// 受邀页页面动态参数
	
	onLoad(async ({ activityId, activityDetail, date, periodType, activityChannelId }) => {
		vdata.isLogin = storageManage.isLogin()
		vdata.activityId = activityId
		vdata.activityDetail = JSON.parse(decodeURIComponent(activityDetail))
		const { home, invite, invited } = JSON.parse(vdata.activityDetail.activityJson || '{}')
		activityJson.value = home
		inviteJson.value = JSON.stringify(invite)
		invitedJson.value = JSON.stringify(invited)
		// 标题更改为活动名称
		uni.setNavigationBarTitle({
			title: vdata.activityDetail.activityName || '越减越便宜'
		})
		vdata.date = date
		vdata.periodType = periodType
		vdata.activityChannelId = activityChannelId
		// 判断活动是否过期
		if (vdata.activityDetail.state !== 4){
			$infoBox.toast('当前活动已下线，正在返回首页！',{ duration: 2000, mask: true })
			setTimeout(() => {
				uni.switchTab({
					url: '/pages/index/index'
				})
			},2000)
			return
		}
		// 判断用户是否登录过
		if (!vdata.isLogin) {
			// 加载弹窗打开
			uni.showLoading({ title: '加载中...', mask: true })
			await getActivityAwards(false) // 获取奖品列表
			uni.showModal({
				title: '提示',
				content: '请先进行登录注册，再进行参与！',
				success({ cancel }) {
					if (cancel) {
						$infoBox.toast('登录失败，无法正常参与活动！')
						// vdata.errorReason = '1、登录失败，无法正常参与活动！'
					} else {
						gzLoginPopupRef.value.open() // 打开授权弹框
					}
				}
			})
			return
		}
		// 如果用户登陆过
		historyMsgHandle(periodType, date)
	})
	
	onShow(async () => {
		// 已登录 但未拉取用户详情 需要拉取用户详情
		if(!storageManage.userInfo()){
			const { bizData:fansInfo } = await $fansDetail()
			Object.assign(vdata.fansInfo,fansInfo)
			// storageManage.userInfo(fansInfo)
		}else{	// 存在用户详情
			Object.assign(vdata.fansInfo,storageManage.userInfo())
		}
		// 用户已实名 不再展示实名活动
		if (vdata.fansInfo.isAuth == 0) {
			vdata.activityList.B2.isShow = false
			vdata.activityList.B3.isShow = false
			vdata.activityList.C.activityName = '福利三'
			vdata.activityList.D.activityName = '福利四'
		}
	})
	
	// 请求卡券余量
	const couponNumber = ref({
		total: 0,	// 卡券总量
		balance: 0,	// 卡券余量
	})
	async function getCouponNumber(activityId){
		const { bizData } = await $getCouponNumber({ activityId })
		const { couponNum, couponGet } = bizData
		couponNumber.value.total = couponNum
		couponNumber.value.balance = numberUtil.computeNumber(couponNum,'-',couponGet).result
	}
	const percent = computed(() => {
		const { total, balance } = couponNumber.value
		if(total > 0){
			return numberUtil.computeNumber(balance,'/',total).next('*',100).toFloatNumber(2)
		}else{
			return 0
		}
	})
	// 历史消息处理
	const historyMsgHandle = async (periodType, date) => {
		let limitType	// 限制类型
		if(periodType == 1){	// 日
			limitType = 'day'
		}else if(periodType == 2){	// 周
			limitType = 'week'
		}else if(periodType == 3){	// 月
			limitType = 'month'
		}else{	// 不限制
			limitType = false
		}
		if(limitType){	// 存在限制
			if(limitType === 'week'){	// 周 需要特殊处理
				if(!dayjs(date).subtract(1,'day').isSame(dayjs().subtract(1,'day'),'week')){	// 判断时间是否同一周 如果不是 不允许参与活动
					vdata.isPeriodLimit = true
				}
			}else{	// day month
				if(!dayjs(date).isSame(dayjs(),limitType)){
					vdata.isPeriodLimit = true
				}
			}
		}
		// 加载弹窗打开
		uni.showLoading({ title: '加载中...', mask: true })
		
		// 自动参与活动 (改为手动参与活动 20240416)
		/* try {
			if(vdata.isPeriodLimit){
				// $infoBox.toast('请重新扫码，参与活动！')
				vdata.errorReason = '1、请重新扫码，参与活动！'
			}else{
				await autoTakePartIn()
				vdata.errorReason = ''
			}
		} catch (e) {
			//TODO handle the exception
			// 参与活动 错误原因
			vdata.errorReason = '1、'+e
		}
		// 加载弹窗打开
		uni.showLoading({ title: '加载中...', mask: true }) */
		await getActivityAwards(false) // 获取奖品列表
	}
	
	/**
	 * 登录回调
	 */
	function isLoginCallback(){
		if(!vdata.isLogin){
			$infoBox.toast('登录失败，无法正常参与活动！')
			// vdata.errorReason = '1、登录失败，无法正常参与活动！'
		}else{
			// 登陆成功后去处理历史消息
			historyMsgHandle(vdata.periodType,vdata.date)
		}
	}

	/**
	 * 自动参与活动
	 */
	const autoTakePartIn = async () => ($activityTakePartIn({ activityId: vdata.activityId, activityTemplateNo: vdata.activityDetail.activityTemplateNo, activityChannelId: vdata.activityChannelId }))

	/**
	 * 打开活动攻略
	 */
	const openPopupHandle = () => {
		popupRef.value.open()
	}
	/**
	 * 页面跳转
	 */
	function toUrl(url,key) {
		// 校验登录
		if (!vdata.isLogin){
			gzLoginPopupRef.value.open() // 打开授权弹框
			return
		}
		// 校验是否是历史公众号消息
		if (vdata.isPeriodLimit){
			$infoBox.toast('请重新扫码，参与活动！')
			return
		}
		// 卡券奖品列表 如果没有path 则考虑发券失败 提示发券接口响应信息
		if(!url){
			// $infoBox.toast(vdata.errorReason)
			if(vdata.errorReason){
				gzPopupRef.value.open()
			}else if(!isShowTakePartInBtn.value){
				if(isJoinedToday.value){	// 今天已经参与活动
					if(key === 'B3' && vdata.activityList.A.fansAwardId){	// A券以及其他券都领到了 但是B3还未领到 说明不会给他发B3
						$infoBox.toast('您已参与过同类型实名活动，福利四不再发放！')
						return
					}
					$infoBox.toast('领取失败！')
				}else{
					$infoBox.toast('未到活动参与时间！')
				}
			}else if(couponNumber.value.balance <= 0){
				$infoBox.toast('今日奖品已被抢光，请下次再来！')
			}else{
				$infoBox.toast('请点击【立即参与】后查看奖励！')
			}
			return
		}
		uni.navigateTo({
			url
		})
	}

	/**
	 * 请求奖品列表
	 */
	const getActivityAwards = async (isShowAlert,isLoop=0) => {
		const { bizData } = await $getActivityAwards({ activityTemplateNo: vdata.activityDetail.activityTemplateNo, activityId: vdata.activityId, isLoop })
		// A B2 B3 C 中是否至少领取一张
		let flag = false
		// B2B3是否发放
		let bSendFlag = true	// 默认发放
		if(!vdata.isLogin){	// 如果用户未登录 所有按钮状态更改为未领取
			for (let key in bizData) {
				bizData[key].btn = '未领取'
				bizData[key].path = ''
				Object.assign(vdata.activityList[key], bizData[key])
			}
			vdata.activityList.B2.awardAliasName = '50福分';
			return
		}
		for (let key in bizData) {
			// if(key === 'A' || key === 'B1' || key === 'D'){
			// 	continue
			// }
			// key === 'B2' || key === 'B3' || key === 'C'	// 按钮状态处理
			if (key === 'A' || key === 'B3' || key === 'C' || key === 'D') {
				if (bizData[key].state === 0) {
					bizData[key].btn = '待使用'
				} else if (bizData[key].state === 1) {
					bizData[key].btn = '已使用'
				} else if (bizData[key].state === 2) {
					bizData[key].btn = '已过期'
				} else if (bizData[key].state === 3) {
					bizData[key].btn = key === 'D' ? '待领取' : '待激活'
				} else if (bizData[key].state === 4) {
					bizData[key].btn = '已失效'
				}
				// 跳转卡券详情
				if(bizData[key].awardId && bizData[key].fansAwardId){
					if(key === 'D'){
						bizData[key].path = `/pageUser/myAward/viewInfo?goodsId=${bizData[key].awardId}&fansAwardId=${bizData[key].fansAwardId}`
					}else{
						bizData[key].path = `/pageUser/myCoupon/viewInfo?couponId=${bizData[key].awardId}&fansAwardId=${bizData[key].fansAwardId}`
					}
					flag = true
				}else{
					bizData[key].btn = '未领取'
				}
			}
			Object.assign(vdata.activityList[key], bizData[key])
			// 判断B2和B3是否发放
			if (key === 'B3') {
				if (vdata.activityList[key].isShow && !vdata.activityList[key].fansAwardId){	// 未实名 且 没发券 说明参与过同类型活动
					bSendFlag = false
				}
			}
		}
		// 判断是否请求 奖品余量进度条 --- 必须放在 A券数据处理完毕之后
		if(!isJoinedToday.value){
			await getCouponNumber(vdata.activityId)
		}
		// 关闭加载弹窗
		uni.hideLoading()
		// B2奖品 和跳转路径单独处理
		Object.assign(vdata.activityList.B2,{
			awardAliasName: '50福分',
			btn: '去实名',
			path: `/pageUser/realName/index?activityId=${vdata.activityId}&activityChannelId=${vdata.activityChannelId}`
		})
		/* // 判断B2B3是否发放 ---- 前端不再组装错误 福利四在点击按钮的时候 单独进行提示发放失败的原因20250510
		if(!bSendFlag && isShowAlert){	// 如果说没发放（但是其他比如A券已经发放了,并且B2B3没发放才能说明参与过同类型的活动），追加错误提示 && vdata.activityList.A.fansAwardId
			if(vdata.errorReason){
				vdata.errorReason += ` 2、您已参与过同类型实名活动，福利四不再发放。`
			}else{
				// vdata.errorReason += `1、您已参与过同类型活动，${vdata.activityList.B2.awardAliasName}和${vdata.activityList.B3.awardAliasName}不再发放`
				vdata.errorReason += `1、您已参与过同类型实名活动，福利四不再发放。`
			}
		} */
		// B1拉新 D绑卡单独处理
		// B1奖品处理----------------------------------------------------
		const { num, awardId, awardType, remark } = bizData.B1
		// 至少领取A B2 B3 C中的一张 才可以参与拉新活动
		if(flag){
			vdata.activityList.B1.path = `/pagesActivity/ACTE017/invite?inviteParams=${JSON.stringify({ activityId: vdata.activityId, awardId, awardType, remark, inviterId: storageManage.fansId(), activityChannelId: vdata.activityChannelId })}&inviteJson=${inviteJson.value}&invitedJson=${invitedJson.value}`
		}
		if (num) {
			vdata.activityList.B1.btn = `已拉新${num}人`
		}else {
			vdata.activityList.B1.btn = `去拉新`
		}
		/* // D奖品处理-------------------------------------------------------
		// 至少领取A B2 B3 C中的一张 才可以参与预约活动
		if(flag){
			vdata.activityList.D.path = `/pagesActivity/ACTE017/appointment?params=${JSON.stringify(Object.assign(bizData.D,{ activityId: vdata.activityId, eTime: vdata.activityDetail.eTime, activityChannelId: vdata.activityChannelId }))}`
		}
		if (state === 3) {
			vdata.activityList.D.btn = `修改预约`
		}else {
			vdata.activityList.D.btn = `去预约`
		} */
		uni.hideLoading()
		// 开启弹窗 提示
		if(vdata.errorReason && isShowAlert){
			gzPopupRef.value.open()
		}else if(isShowAlert){
			$infoBox.toast('领取成功！')
		}
	}
	/**
	 * 参与活动后 处于发券中 或排队中的处理
	 */
	// 实例化非线性任务对象
	const intervals = [1000, 3000, 5000, 10000, 15000]
	const polling = new Polling(refreshAwardTask,intervals,endTaskCallback)
	// 任务结束回调 - 主要是用于轮询结束 内部通知外部轮询已结束 处理一些轮询结束后的操作 - 例如关闭弹窗
	function endTaskCallback(){
		console.log('内部通知外部 任务结束');
		loadingPopupRef.value.close()
		$infoBox.toast('请重新抢券！')
	}
	
	// 任务 刷新奖品列表判断 奖品是否已发放成功 成功的话停止任务 仍未发放的话 继续任务
	async function refreshAwardTask(){
		try {
			await getActivityAwards(false,1)
			// 直接判断今天是否参与过 isJoinedToday 或者 卡券被领取完 也结束任务
			if(isJoinedToday.value){    // 抢到了
				polling.stop()
				loadingPopupRef.value.close()
				$infoBox.toast('领取成功！')
				return
			}
			if(couponNumber.value.balance <= 0){    // 未抢到 且卡券没了
				polling.stop()
				loadingPopupRef.value.close()
				$infoBox.toast('很遗憾，今日卡券已被抢光！')
			}
		} catch (error) {    // 任务失败 中断任务提示失败
			//TODO handle the exception
			// $infoBox.toast('error')
			polling.stop()
			loadingPopupRef.value.close()
		}
	}
	const specialRes = ref({})
	const upCallback = async (mescroll = { endErr:() => {}, endSuccess: () => {} }) => {
		// 登录校验
		if (!vdata.isLogin){
			gzLoginPopupRef.value.open() // 打开授权弹框
			mescroll.endErr()
			return
		}
		// 自动参与活动
		// 加载弹窗打开
		uni.showLoading({ title: '加载中...', mask: true })
		
		try {
			if(vdata.isPeriodLimit){
				$infoBox.toast('请重新扫码，参与活动！')
				// vdata.errorReason = '1、请重新扫码，参与活动！'
			}else{
				const { code, bizData } = await autoTakePartIn()
				vdata.errorReason = ''	// 重置错误
				if(code === 40004){	// 记录错误码以及错误信息 	// 如果时排队或者是在发券中则开启任务并打开弹窗
					specialRes.value = {
						code,
						msg:bizData
					}
					// 开启动画弹窗 并开启任务
					loadingPopupRef.value.open()
					polling.start()
				}else{	// 重置
					specialRes.value = {}
				}
				// vdata.errorReason = ''
			}
		} catch (e) {
			//TODO handle the exception
			// 参与活动 错误原因
			specialRes.value = {}    // 重置
			vdata.errorReason = e
		} finally {
			try{
				if(specialRes.value.code === 40004){	// 发券或者在排队中 则不请求奖品接口 交给任务刷新
					uni.hideLoading()
					return
				}
				// 加载弹窗打开
				uni.showLoading({ title: '加载中...', mask: true })
				await getActivityAwards(true) // 刷新奖品列表数据
				mescroll.endSuccess(0)
			}catch(e){
				//TODO handle the exception
				mescroll.endErr()
			}
		}
	}
	
	/**
	 * 跳转活动攻略
	 */
	const onJumpActivityGuide = (url) => {
		uni.navigateTo({
			url
		})
	}
	
	// 关闭抢券加载弹框
	function loadingPopupClose(){
		// 结束任务 并关闭弹窗
		polling.stop()
		loadingPopupRef.value.close()
	}
</script>

<style lang="less" scoped>
	.loading-popup-container{
		padding: 50px;
		text-align: center;
		.popup-close{
			margin-top: 200rpx;
			width: 50rpx;
			height: 50rpx;
		}
	}
	.loading {
	  display: flex;
	  color: aliceblue;
	  font-size: 120rpx;
	  font-family: "YouSheBiaoTiHei", cursive;
	  text-transform: uppercase;
	}
	.loading text {
	  text-shadow: 0 1px rgba(0, 0, 0, 0.1), 0 2px rgba(0, 0, 0, 0.1), 0 3px rgba(0, 0, 0, 0.1), 0 4px rgba(0, 0, 0, 0.1), 0 5px rgba(0, 0, 0, 0.1), 0 6px transparent, 0 7px transparent, 0 8px transparent, 0 9px transparent, 0 10px 10px rgba(0, 0, 0, 0.2);
	  transform: translateY(20px);
	  animation: bounce 0.5s ease infinite alternate;
	}
	
	@keyframes bounce {
	  to {
	    text-shadow: 0 1px #bbb, 0 2px #bbb, 0 3px #bbb, 0 4px #bbb, 0 5px #bbb, 0 6px #bbb, 0 7px #bbb, 0 8px #bbb, 0 9px #bbb, 0 50px 25px rgba(0, 0, 0, 0.1);
	    transform: translateY(-20px);
	  }
	}
	// 主题颜色
	@theme-color: #FF4B46;
	.container {
		overflow: hidden; // 解决子元素margin影响父元素
		width: 100%;
		min-height: 100vh;
		padding: 24rpx;
		box-sizing: border-box;
		background: url('https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/a4f35f1a-9e99-4efd-84d3-bddeda7f4e6f.png'),
			url('https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/91b50d14-9772-4864-a106-e6a47f2c7d7d.png'),
			url('https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/c19bed66-a2c8-4d4d-88b7-8f52b866c9f6.png');
		background-position: center 30rpx, left top, left top;
		background-size: 303rpx 40rpx, 100% 852rpx, 100% 100%;
		background-repeat: no-repeat;
		position: relative;
		
		.tag{
			position: absolute;
			right: 0;
			top: 80rpx;
			min-width: 120rpx;
			border-radius: 30rpx 0rpx 0rpx 30rpx;
			color: #fff;
			background-color: rgba(0, 0, 0, 0.3);
			font-size: 24rpx;
			padding: 10rpx 10rpx;
			text-align: center;
		}

		.content {
			margin-top: 654rpx;
			padding: 16rpx;
			border-radius: 16rpx;
			background-color: #fff;
			.title {
				width: 100%;
				height: 102rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				background: url('https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/6fafe83d-307a-47df-bffa-b6921d7be668.png') no-repeat left top / 100% 100%;
			
				view {
					color: #fff;
					padding: 0 24rpx;
					font-weight: bold;
					display: flex;
					align-items: center;
				}
			
				image {
					width: 240rpx;
					height: 34rpx;
				}
			}

			.list {
				display: flex;
				flex-direction: column;
				gap: 24rpx;
				margin-top: 24rpx;

				.item {
					background-color: @theme-color;
					border-radius: 16rpx;
					padding: 24rpx;
					
					.take-btn {
						background: linear-gradient(to right, #FE6038, #FF4C46);
						border: 4rpx solid #fff;
						color: #fff;
						border-radius: 45rpx;
						margin-top: 24rpx;
						box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.5);
						font-weight: bold;
					}

					.inner {
						background-color: #fff;
						border-radius: 16rpx;
						display: flex;
						align-items: center;
						gap: 16rpx;
						padding: 24rpx;

						image {
							width: 112rpx;
							height: 112rpx;
							flex-shrink: 0;
						}

						&>view {
							flex-grow: 1;

							view {
								&:nth-child(1) {
									font-size: 30rpx;
									font-weight: bold;
								}

								&:nth-child(2) {
									margin-top: 10rpx;
									color: #aaa;
									font-size: 28rpx;
								}
							}
						}

						button {
							min-width: 120rpx;
							border: none;
							background-color: #FDE9E9;
							color: @theme-color;
							line-height: initial;
							padding: 10rpx 20rpx;
							border-radius: 24rpx;
							font-size: 24rpx;
							flex-shrink: 0;
						}
					}
				}
			}
		}
	}


	.popup-container {
		padding: 36rpx;
		box-sizing: border-box;
		background: #fff;
		min-width: 600rpx;
		max-width: 90%;
		margin: 0 auto;
		border-radius: 16rpx;

		.title {
			width: 428rpx;
			height: 88rpx;
			background: url('https://jdyd-marketing-public.oss-cn-hangzhou.aliyuncs.com/yx/fbbab547-24b3-4957-a082-994f8bfec018.png') no-repeat left top / 100% 100%;
			font-weight: 600;
			font-size: 36rpx;
			color: #683800;
			text-align: center;
			line-height: 88rpx;
			position: relative;
			left: 50%;
			transform: translateX(-50%);
			top: -50rpx;
		}

	}

	:deep(.mescroll-upwarp) {
		display: none !important;
	}
</style>